.qqwebpage{
    .head{
        padding: 20px 30px;
        background-image: linear-gradient(to right, #00d9ff , #00bcff);
        .headPortrait img{
            width: 50px;
            height: 50px;
            border-radius: 50%;
        }
        .yd{
            color: #2ce68e;
        }
        & .add i{
            font-size: 35px;
        }
    }
    .content{
        margin: 15px 30px 80px 30px;
        .search{
            height: 40px;
            width: 100%;
            background-color: #f7f7f799;
            border-radius: 30px;
        }
        .box{
            margin: 20px 0;
            & img{
                width: 60px;
                height: 60px;
                border-radius: 50%;
            }
            .pdd{
                width: 70%;
                overflow: hidden;
                text-overflow: ellipsis;/* 超出部分用省略符号代替 */
                display: -webkit-box;
                -webkit-line-clamp: 1;/* 块元素显示的文本行数 */
                -webkit-box-orient:vertical;/*必须结合的属性，从顶部向底部垂直布置子元素*/
            }
            .message{
                width: 30px;
                height: 30px;
                border-radius: 50%;
                background-color: #d4dbe0;
            }
        } 
    }
    .foot{
        height: 60px;
        width: 100%;
        background-color: #fbfbfb;
        bottom: 0;
        & i{
            font-size: 30px;
        }
        & .yd{
            font-size: 15px;
            color: #f75b73;
        }
        & div:first-child a i{
            color: #47cafe;
        }
    }
}